import 'package:chathouse/pages/expert/buyWallet/recharge_bank_card.dart';
import 'package:chathouse/public/Config.dart';
import 'package:chathouse/util/base_utils.dart';
import 'package:chathouse/util/log.dart';
import 'package:flutter/material.dart';

import '../../../constant/app_constant.dart';
import '../../../model/client_search_model.dart';
import '../../route_manager/root_route_manager.dart';
import '../home/service_detail.dart';

/// @class : client_hot_search_page
/// @date : 2023-02-25 13:22
/// @name : LFC
/// @description :
class ClientHotSearchPage extends StatefulWidget {
  const ClientHotSearchPage({Key? key}) : super(key: key);

  @override
  State<ClientHotSearchPage> createState() => _ClientHotSearchPageState();
}

class _ClientHotSearchPageState extends State<ClientHotSearchPage>
    with AutomaticKeepAliveClientMixin ,NavigationHelper{
  ClientSearchModel? clientSearchModel;

  @override
  bool get wantKeepAlive => true;

  @override
  void initState() {
    super.initState();
    Obj.showLoading();
    Apis.getHotList().then((response) {
      Obj.dismissLoading();
      var data = response?.data;
      if (data == null) {
        return;
      }
      setState(() {
        clientSearchModel = ClientSearchModel.fromJson(data);
      });
    }).catchError((error) {
      LogUtil.d("getHotList error $error");
      Obj.dismissLoading();
    });
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return Scaffold(
      appBar: AppBar(
        toolbarHeight: 40.w,
        backgroundColor: Colors.white,
        shadowColor: Colors.transparent,
      ),
      body: SizedBox(
        width: double.infinity,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            ImageUtils.image(Res.login_logo, width: 48.w, height: 52.w),
            SizedBox(height: 12.w),
            Text("熱門服務搜尋", style: getTextStyle(25.sp, fontType: FontType.BOLD)),
            Expanded(
                child: GridView.builder(
              padding: EdgeInsets.symmetric(horizontal: 26.w, vertical: 22.w),
              itemCount: clientSearchModel?.data?.length ?? 0,
              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 2,
                mainAxisSpacing: 12,
                crossAxisSpacing: 12,
                childAspectRatio: 169 / 56,
              ),
              itemBuilder: (_, position) => buildItem(position),
            )),
          ],
        ),
      ),
    );
  }

  Widget buildItem(index) {
    if (clientSearchModel == null) {
      return Container();
    }
    var widget = Center(
      child: Text(
        clientSearchModel?.data![index].serviceName ?? "",
        overflow: TextOverflow.ellipsis,
        maxLines: 2,
        textAlign: TextAlign.center,
        style: getTextStyle(18.sp,
            fontType: FontType.MID, color: MyColors.black_0000011),
      ),
    )
        .setContainer(
            padding: EdgeInsets.symmetric(horizontal: 4.w),
            alignment: Alignment.center,
            decoration: BoxDecoration(
                color: MyColors.gary_226226226,
                borderRadius: BorderRadius.circular(11.w)))
        .setOnClickListener(() {
      toServeDetailPage(clientSearchModel?.data![index].serviceId ??
          AppConstant.testWaterService);
      // Get.to(ServiceDetailPage(clientSearchModel?.data![index].serviceId ??
      //     AppConstant.testWaterService));
    }, isInkWell: true);
    return widget;
  }

  void toServeDetailPage(num id) {
    // Get.to(ServiceDetailPage(id));
    navigateTo(ServiceDetailPage(id));
  }
}
